<template>
	<view>
		<view class="cu-form-group margin-top">
			<view class="title">选择小区</view>
			<picker @change="PickerShopChange" :value="shop_index" :range="shop_list_range">
				<view class="picker">{{ shop_index > -1 ? shop_list_range[shop_index + 1] : '请选择小区' }}</view>
			</picker>
		</view>
		<view class="cu-form-group ">
			<view class="title">选择小区所在单元</view>
			<picker @change="PickerBuildingChange" :value="building_index" :range="building_range">
				<view class="picker">{{ building_index > -1 ? building_range[building_index + 1] : '请选择单元' }}</view>
			</picker>
		</view>
		<view class="cu-form-group ">
			<view class="title">选择房号</view>
			<picker @change="PickerRoomsChange" :value="rooms_index" :range="rooms_range">
				<view class="picker">{{ rooms_index > -1 ? rooms_range[rooms_index + 1] : '选择房号' }}</view>
			</picker>
		</view>
		<view class="box margin-top-20" style=" padding: 20upx;">
			<button @click="getOutRoomId" class="cu-btn block bg-blue margin-tb-sm lg">
				<text class="cuIconfont-spin"></text>
				确定
			</button>
		</view>
	</view>
</template>

<script>
import beeApp from '../../beeApp.js';
export default {
	data() {
		return {
			shop_list: [],
			shop_index: -1,

			shop_list_range: [],
			building: [],
			building_key: '',
			building_index: -1,
			building_range: [],
			rooms: [],
			rooms_index: -1,
			rooms_range: [],
			community_id: ''
		};
	},
	onLoad() {
		this.getShopList();
	},

	methods: {
		PickerShopChange: function(e) {
			this.shop_index = e.detail.value - 1;
			console.log(e, this.shop_index);

			this.setData({
				building: [],
				building_key: '',
				building_index: -1,
				building_range: [],
				rooms: [],
				rooms_index: -1,
				rooms_range: []
			});
			if (!this.shop_list[this.shop_index]) {
				return;
			}
			this.community_id = this.shop_list[this.shop_index].id;
			this.getBuilding();
		},
		PickerRoomsChange: function(e) {
			this.rooms_index = e.detail.value - 1;
			this.outRoomId = this.rooms[this.rooms_index].out_room_id;
		},
		PickerBuildingChange: function(e) {
			this.building_index = e.detail.value - 1;

			this.setData({
				rooms: [],
				rooms_index: -1,
				rooms_range: []
			});
			if (!this.building[this.building_index]) {
				return;
			}
			this.building_key = this.building[this.building_index].key;
			this.getRooms();
		},

		getShopList: function() {
			var that = this;
			beeApp.api(
				'mall/shop/get',
				{
					type: 'tenement'
				},
				function(res) {
					if (res.code != 200) {
						beeApp.alert(res.msg);
						return;
					}
					that.shop_list = res.data.list;
					var list = ['请选择小区'];
					for (var i in res.data.list) {
						list.push(res.data.list[i].name);
					}
					that.shop_list_range = list;
				}
			);
		},
		getBuilding: function() {
			var that = this;
			beeApp.api(
				'api/community_rooms/getBuilding',
				{
					community_id: this.community_id
				},
				function(res) {
					if (res.code != 200) {
						beeApp.alert(res.msg);
						return;
					}
					that.building = res.data;
					var list = ['请选择单元'];
					for (var i in res.data) {
						var name = res.data[i].group + res.data[i].building + res.data[i].unit;
						list.push(name);
					}
					that.building_range = list;
				}
			);
		},
		getRooms: function() {
			var that = this;
			beeApp.api(
				'api/community_rooms/get',
				{
					community_id: this.community_id,
					building_key: this.building_key
				},
				function(res) {
					if (res.code != 200) {
						beeApp.alert(res.msg);
						return;
					}
					that.rooms = res.data.list;
					var list = ['请选择房号'];
					for (var i in res.data.list) {
						list.push(res.data.list[i].address);
					}
					that.rooms_range = list;
				}
			);
		},
		getOutRoomId: function() {
			if (!this.outRoomId) {
				beeApp.alert('请先选择房屋');
				return;
			}
			uni.setStorageSync('out_room_id', this.outRoomId);
			uni.setStorageSync('community_id', this.community_id);
			beeApp.setPageData('pages/bills/bills', { reload: 1 });
			// uni.redirectTo({
			// 	url: '/pages/bills/bills'
			// });
			uni.navigateBack()
			

			// uni.navigateTo({
			// 	url:'/pages/bills/bills?out_room_id='+this.outRoomId+'&community_id'+this.community_id
			// })
		},

		setData: function(data) {
			for (var i in data) {
				this[i] = data[i];
			}
		}
	}
};
</script>

<style></style>
